<template>
    <div class='test'>
        <div class="moduleHead">
            <span class="center">
                LetsMeet
            </span>
        </div>
        <div class="body">
            <div class='sliderBox'>
                <div v-for="(item,index) in items" :key="index">
                    <LetsMeet :propsIndex="index" :propsInfo="item" :propsLength="items.length"></LetsMeet>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import LetsMeet from './Test2'
export default {

    name: 'test',

    components: {
        LetsMeet
    },

    data: function() {
        return {
            list: [{
                src: 'https://farm2.staticflickr.com/1043/5186867718_06b2e9e551_b.jpg',
                w: 964,
                h: 1024
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }, {
                src: 'https://farm7.staticflickr.com/6175/6176698785_7dee72237e_b.jpg',
                w: 1024,
                h: 683
            }]
        }
    },

    computed: {
        items: function() {
            let data = [];
            for (let i in this.list) {
                data.push(this.list[i]);
            }
            return data;
        },
    },
}

</script>
<style scoped>
.test {}

.test .sliderBox {
    margin-top: 44px;
    position: relative;
    height: calc(100% - 44px);
}

.test .sliderBox .letsmeet:nth-child(n+3) {
    -webkit-transform: translate(0px, 14px) scale(0.9, 1);
    -moz-transform: translate(0px, 14px) scale(0.9, 1);
}

.test .sliderBox .letsmeet:nth-child(3) {
    -webkit-transform: translate(0px, 14px) scale(0.9, 1);
    -moz-transform: translate(0px, 14px) scale(0.9, 1);
}

.test .sliderBox .letsmeet:nth-child(2) {
    -webkit-transform: translate(0px, 7px) scale(0.95, 1);
    -moz-transform: translate(0px, 7px) scale(0.9, 1);
}

</style>
